import React,{Component} from 'react';
import './callbackPage.scss';
import {
  Link
} from 'react-router-dom';
import { payOrder } from 'api/order.js';
import { message } from 'antd';
let getQueryString = function (name) {
    let reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
    let r = window.location.search.substr(1).match(reg);
    if (r !== null) return unescape(r[2]);
    return null;
}
export default class CallbackPage extends Component{
	constructor (props) {
		super(props)
		this.state={
			payCall: getQueryString('flag'),
			uorder: getQueryString('uorder_id')
		}
	}
	componentDidMount () {
		this.setState({
			payCall: getQueryString('flag'),
			uorder: getQueryString('uorder_id')
		})
	}
	goPay = () => {
		payOrder({
			uorder_id: this.state.uorder,
			payment_channel: 2
		}).then(res => {
			if (res.code === 1){
				window.location.href = res.data
			} else {
				message.error(res.message, 2)
			}
		})
	}
	render(){
		return(
			<div className="callbackPage">
				<div className="news_title">
					<Link to="/"><span className="glyphicon glyphicon-back back"></span></Link>订单详情
				</div>
				{
					this.state.payCall === 'true' ? <div className="">
						<div className="payState">
							<span className="glyphicon glyphicon-success"></span>
							<p>订单支付成功</p>
						</div>
						<div className="payInfo">
							<Link to='/user/order'>订单列表</Link>
							<Link to='/'>再逛逛</Link>
						</div>
					</div> : <div className="">
						<div className="payState">
							<span className="glyphicon glyphicon-error"></span>
							<p>订单支付失败</p>
						</div>
						<div className="payInfo">
							<Link to='/user/order'>订单列表</Link>
							<span onClick={this.goPay}>再试一次</span>
						</div>
					</div>
				}
			</div>
		)
	}
}